<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title id="title">首页</title>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-touch-fullscreen" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<meta name="format-detection" content="address=no">
		<link rel="stylesheet" type="text/css" href="css/common.css">
		<link rel="stylesheet" type="text/css" href="css/index.css">
		<link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
		<link rel="stylesheet" href="css/reset.css">
		<script type="text/javascript" src="js/jquery.min.js"></script>
	
		<script type="text/javascript" src="js/iscroll.js"></script>
		<!-- <script type="text/javascript" src="js/jquery.flexslider-min.js"></script> -->
		<script src="js/hmt.js" type="text/javascript"></script>
		<script type="text/javascript" src="js/index.js"></script>
		<script src="js/swiper.min.js" type="text/javascript" ></script>
		<!--<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>-->
		<script type="text/javascript" src="http://yanyubao.tseo.cn/Tpl/static/jquery.tmpl.js"></script>
    	<script type="text/javascript" src="http://yanyubao.tseo.cn/Tpl/Home/default/js/jquery.lazyload.min.js"></script>

		
		<script type="text/javascript" src="js/abot.js"></script>
		<script type="text/javascript" src="http://yanyubao.tseo.cn/api/shopapp.js"></script> 
		
	</head>

	<body>
		<header class="hasManyCity" id="header">
			
			<a href="category.html"><div id="locaitonBtn" class="link-url locaitonBtn"></div></a>
			
			<div id="" class="searchBox">
				<a href="search.html">
					<i class="icon-search"></i>
					<span>请输入您想找的内容</span>
				</a>
			</div>
			<a href="http://cms.weiduke.com/index.php?g=Wap&m=Index&a=content&token=nzzghw1527819440&id=2482"><div id="" class="qrcodeBtn"></div></a>
			
				
					
				
		</header>
		<div id="container">		
			<div id="main">
				<div id="scroller">
					<section class="banner" style="height: auto;">
						<div class="swiper-container swiper-container1">
							<div class="swiper-wrapper bannerwidth" id="ad_list">
						
							 <script id="template_ad_list" type="text/x-jquery-tmpl">
								<div class="swiper-slide">
									<a href="#">
										<img src="${image}"> 
									</a>
								</div>
							</script>
							
								<!-- 
								<div class="swiper-slide swiper-slide-duplicate">
									<a href="#">
										<img src="img/55dec2a5c2fa3.png">
									</a>
								</div>
								<div class="swiper-slide">
									<a href="#">
										<img src="img/55dec2a5c2fa3.png">
									</a>
								</div>
								<div class="swiper-slide swiper-slide-duplicate">
									<a href="#">
										<img src="img/55dec2a5c2fa3.png">
									</a>
								</div>
								<div class="swiper-slide">
									<a href="#">
										<img src="img/55dec2a5c2fa3.png">
									</a>
								</div>
								 -->
							</div>
							<div class="swiper-pagination swiper-pagination1">
							</div>
						
					</script>
					</section>
					
					<section class="slider">
						<div class="swiper-container swiper-container2">
							<div class="swiper-wrapper tuangouwidth"  style="height: auto;">
								<div class="swiper-slide swiper-slide-duplicate" style="padding-bottom: 10px;"">
									<ul class="icon-list" id="icon_index">
									<script id="template_icon_index" type="text/x-jquery-tmpl">
										<li class="icon" style="width: 20%;">
											<a href="${url}">
												<span class="icon-circle">
													<img src="${src}">
												</span>
												<span class="icon-desc">${name}</span>
											</a>
										</li>
									</script>
										<!-- 
										<li class="icon">
											<a href="tuan.html">
												<span class="icon-circle">
													<img src="img/a1.png">
												</span>
												<span class="icon-desc">团购</span>
											</a>
										</li>
										<li class="icon">
											<a href="delivery.html">
												<span class="icon-circle">
													<img src="img/a2.png">
												</span>
												<span class="icon-desc">外卖</span>
											</a>
										</li>
										<li class="icon">
											<a href="rush.html">
												<span class="icon-circle">
													<img src="img/a3.png">
												</span>
												<span class="icon-desc">限时抢购</span>
											</a>
										</li>
										<li class="icon">
											<a href="indiana.html">
												<span class="icon-circle">
													<img src="img/a4.png">
												</span>
												<span class="icon-desc">一元夺宝</span>
											</a>
										</li>
										<li class="icon">
											<a href="yule.html">
												<span class="icon-circle">												
													<img src="img/a5.png">
												</span>
												<span class="icon-desc">娱乐</span>
											</a>
										</li>
										<li class="icon">
											<a href="hotel.html">
												<span class="icon-circle">												
													<img src="img/a6.png">
												</span>
												<span class="icon-desc">酒店</span>
											</a>
										</li>
										<li class="icon">
											<a href="tourism.html">
												<span class="icon-circle">
													<img src="img/a7.png">
												</span>
												<span class="icon-desc">旅游</span>
											</a>
										</li>
										<li class="icon">
											<a href="piaowu.html">
												<span class="icon-circle">
													<img src="img/a8.png">
												</span>
												<span class="icon-desc">票务</span>
											</a>
										</li>
										 -->
									</ul>
								</div>
								<!-- 
								<div class="swiper-slide swiper-slide-duplicate">
									<ul class="icon-list">
										<li class="icon">
											<a href="self.html">
												<span class="icon-circle">
													<img src="img/b1.png">
												</span>
												<span class="icon-desc">生活服务</span>
											</a>
										</li>
										<li class="icon">
											<a href="mall.html">
												<span class="icon-circle">
													<img src="img/b2.png">
												</span>
												<span class="icon-desc">百货商城</span>
											</a>
										</li>
										<li class="icon">
											<a href="jifen-mall.html">
												<span class="icon-circle">
													<img src="img/b3.png">
												</span>
												<span class="icon-desc">积分商城</span>
											</a>
										</li>
										<li class="icon">
											<a href="farm.html">
												<span class="icon-circle">
													<img src="img/b4.png">
												</span>
												<span class="icon-desc">农家乐</span>
											</a>
										</li>
										<li class="icon">
											<a href="renting.html">
												<span class="icon-circle">												
													<img src="img/b5.png">
												</span>
												<span class="icon-desc">租车</span>
											</a>
										</li>
										<li class="icon">
											<a href="hand.html">
												<span class="icon-circle">												
													<img src="img/b6.png">
												</span>
												<span class="icon-desc">二手房</span>
											</a>
										</li>
										<li class="icon">
											<a href="self-pay.html">
												<span class="icon-circle">
													<img src="img/b7.png">
												</span>
												<span class="icon-desc">生活缴费</span>
											</a>
										</li>
										<li class="icon">
											<a href="category.html">
												<span class="icon-circle">
													<img src="img/b8.png">
												</span>
												<span class="icon-desc">分类信息</span>
											</a>
										</li>
									</ul>
								</div>
								 -->
							</div>
						
						</div>
					</section>
				</div>
							
				<div id="index" class="page-center-box">
					<div>				
						<!--首页限时抢购开始-->
						<div class="sy_title"><span class="left">限时抢购 热销</span>
							<div class="sy_limit_buy_time left">
								<em class="ico"></em>
								距离结束
								<span class="time" remaintime="1442800030">
									<span>00</span>天
									<span>00</span>时
									<span>00</span>分
									<span>00</span>秒
								</span>
							</div>
						</div>
						<div class="sy_limit_buy mb10">
							<div class="locatLabel_switch swiper-container5 swiper-container-horizontal swiper-container-free-mode swiper-container-android">
								<div class="swiper-wrapper" id="baokuan_list">
								
								<script id="template_baokuan" type="text/x-jquery-tmpl">
									<div class="box swiper-slide">
										<a href="mall-detail.html?productid=${productid}">
											<img src="${picture}" >
											<p class="txt_center overflow_clear">${name}</p>
											<p class="txt_center fontcl1">¥${price}<small class="ml10"><del class="black9">￥${price2}</del></small></p>
										</a>
									</div>
								</script>

									<!--  
									<div class="box swiper-slide">
										<a href="#">
											<img src="img/thumb_566813906046a.jpg" width="" height="">
											<p class="txt_center overflow_clear">测试</p>
											<p class="txt_center fontcl1">¥50<small class="ml10"><del class="black9">￥60</del></small></p>
										</a>
									</div>
									-->
									
								</div>
							</div>
	
						</div>
						<!--首页限时抢购结束-->
											
						<!--热门商家-->
						<div class="sy_title">
							<span class="left">热门商家</span>
							<a href="remen.html" class="fr morethree">更多&gt;&gt;</a>
						</div>
						<div class="sy_hot_seller">
							<div class="sy_limit_buy mb10">
								<div class="locatLabel_switch swiper-container6 swiper-container-horizontal swiper-container-free-mode swiper-container-android">
									
									<div class="swiper-wrapper" id="tuijian_list">
									<script id="template_tuijian" type="text/x-jquery-tmpl">
										<div class="box swiper-slide">
											<a href="mall-detail.html?productid=${productid}">
												<img src="${picture}" style="height: 100%;width: 100%;">
												<p class="txt_center overflow_clear">${name}</p>
												<p class="fontcl2">2人关注<small class="ml10 fr black9">已售${sale_volume}</small></p>
											</a>
										</div>
									</script>
									
										<!-- 
										<div class="box swiper-slide">
											<a href="#">
												<img src="img/thumb_5745110bbc27c.jpg" width="114" height="114">
												<p class="txt_center overflow_clear">菲诗小铺</p>
												<p class="fontcl2">2人关注<small class="ml10 fr black9">已售0</small></p>
											</a>
										</div>
										 -->
										 
									</div>
								</div>
							</div>
						</div>
						<!--热门商家end-->
						
						<!--广告轮播-->
						<!-- <div class="banner">
							<div class="flexslider guanggao">
								<ul class="slides">
									<li>
										<a href="#" title="家居广告1">
											<img src="img/553b0e58b6c52.jpg" alt="家居广告1" width="100%">
										</a>
									</li>
									<li class="flex-active-slide">
										<a href="#" title="家居广告2">
											<img src="img/553b0e254774b.jpg" alt="家居广告2" width="100%">
										</a>
									</li>
								</ul>
							</div>
						</div> -->
						
						
							<div style="height: 120px;" id="img_list">
								<script id="template_img_list" type="text/x-jquery-tmpl">
									<div style="width: 100%;  float: left;"> 
										<a href="#" title="家居广告1">
											<img src="${image}" alt="家居广告1" style="width: 100%;">
										</a>
									</div>
								</script>
									<!-- <div style="width: 50%;  float: left;"> 
										<a href="#" title="家居广告2">
											<img src="img/553b0e254774b.jpg" alt="家居广告2" style="width: 100%; height: 100%">
										</a>
									</div> -->
								
							</div>
						
						
						<!--广告轮播end-->
		
						<!--专享推荐-->
						<div class="sy_title mb10">
							<span class="left">热门推荐</span>
							<a href="#" class="fr morethree">更多&gt;&gt;</a>
						</div>
						<div class="sy_recmd">
							<div class="sy_recmd_list_box">
								<ul id="product_list">
								<script id="template_product" type="text/x-jquery-tmpl">
								<li class="sy_recmd_list">
										<div class="box">
											<div class="pub_img">
												<a href="mall-detail.html?productid=${productid}"><img src="${picture}"></a>
											</div>
											<div class="pub_wz">
												<h3 class="overflow_clear"><a href="#">${name}</a></h3>
												<div class="nr_box">
													<p class="fl fontcl2">¥${price}</p>
													<span class="fl black9">${cataname}</span>
													<p class="fr price fontcl2"><span class="black9">已售${sale_volume}</span></p>
												</div>
											</div>
										</div>
									</li>
								</script>

									<!--  
									<li class="sy_recmd_list">
										<div class="box">
											<div class="pub_img">
												<a href="mall-detail.html"><img src="img/thumb_543ba5688cb7b.jpg" width="145" height="145"></a>
											</div>
											<div class="pub_wz">
												<h3 class="overflow_clear"><a href="#">喜来登酒店</a></h3>
												<div class="nr_box">
													<p class="fl fontcl2">¥25</p>
													<span class="fl black9">[优惠活动]</span>
													<p class="fr price fontcl2"><span class="black9">已售50</span></p>
												</div>
											</div>
										</div>
									</li>
									-->
									
								</ul>
								<div class="clear"></div>
								<a class="react " href="#">
								 <div class="moreone" id="emLoadnull">加载更多</div>
								</a>
							</div>
						</div>
						
						<!--专享推荐end-->
					</div>
				</div>
			</div>
		</div>
		<footer id="footer">
			<div>
				<a href="index.html">
					<div class="icon i-1 on"></div>
					<p>商城首页</p>
				</a>
			</div>
			<div>
				<a href="mall.html">
					<div class="icon i-7"></div>
					<p>全部商品</p>
				</a>
			</div>
			<div>
				<a href="http://yanyubao.tseo.cn/Home/OnlineChat/chat.html?ensellerid=fyzNUPkaW">
					<div class="icon i-2"></div>
					<p>在线客服</p>
				</a>
			</div>
			<div>
				<a href="shopcar.html">
					<div class="icon i-3"></div>
					<p>购物车</p>
				</a>
			</div>
			<div>
				<a href="center.html">
					<div class="icon i-4"></div>
					<p>会员中心</p>
				</a>
			</div>			
		</footer>		

	<script type="text/javascript">
	
	//商品列表
	var next_page = 1;
	var _is_loading = false;
	function product_list_callback(code, counter, product_list){
		_is_loading = false;
		
		console.log('code:'+code);	
		
		if(code == 0){
			next_page = -1;
			console.log('aaaaaaaaaaaaa');
			
			$("#product_list").append("<div style='width:100%;height:30px;line-height:30px;text-align:center;color:#666;clear: both;'>我也是有底线的</div>");
			$("#emLoadnull").css('display','none');
		}
		else{
			$('#template_product').tmpl(product_list).appendTo('#product_list');
			
			$("img.lazy").lazyload({	
				placeholder : '/Tpl/Home/default/js/img/grey.gif', /*加载图片前的占位图片*/
				effect      : "fadeIn" /*加载图片使用的效果(淡入)*/
			});
			
			var img_width = $(".goods-img img").width();//上边图片，下边详情
			//var img_height = img_width*2/3;
			var img_height = img_width;
			//alert(img_height);
			$(".goods-img img").css({'height':img_height}); //1:1的图片比例
		}
	}


	//上方icon
	function icon_list_callback(icon_list){
		$('#template_icon_index').tmpl(icon_list).appendTo('#icon_index');
	};

	//限时秒杀改成热销
	function product_baokuan_list_callback(code, counter, product_list){
		$("#template_baokuan").tmpl(product_list).appendTo('#baokuan_list');
	};
	
	//热门推荐
	function product_tuijian_list_callback(code, counter, product_list){	
		$("#template_tuijian").tmpl(product_list).appendTo('#tuijian_list');
	};
	
	//滚动广告
	function ajax_request_server_callback(res){
		$('#template_ad_list').tmpl(res.data).appendTo('#ad_list');

		console.log(1231213);
		console.log(res);
		console.log(1231213);
		
		//初始化Swiper
		var mySwiper = new Swiper('.swiper-container', {
			autoplay: 3000,//可选选项，自动滑动
			//分页器 默认圆点
			pagination : '.swiper-pagination',
		})

	}
	
	
	//平铺广告
/* 	function get_flash_img_list_callback(img_list){
		$('#template_img_list').tmpl(img_list).appendTo('#img_list');
	} */
	
	function get_flash_img_list_callback(res){
		$('#template_img_list').tmpl(res.data).appendTo('#img_list');
	}
	
	//商城信息 标题
	function get_shop_info_callback(res){
		$('#title').html(res.data.name); 
	}
	
	$(function () {
		//商城信息
		var function_name = "get_shop_info";
		ajax_request_server(function_name, request_data,get_shop_info_callback);
		
    	
    	var data = {'page':next_page ++, };
    	//var data = {'p':1};
    	var res = {'page':1 };
    	
     	get_product_list(data, product_list_callback);

    	//上方icon
     	get_icon_list(icon_list_callback);
    	
     	//限时秒杀改成热销
     	get_product_baokuan_list(data,product_baokuan_list_callback);
     	
     	//热门推荐
		get_product_tuijian_list(res,product_tuijian_list_callback);
     	
 
		//滚动广告
		var function_name = "get_flash_ad_list";
		var request_data = {'page':1};
		ajax_request_server(function_name, request_data,ajax_request_server_callback);
		
		//平铺广告
		/* get_flash_img_list(get_flash_img_list_callback) */
		var function_name = "get_flash_img_list";
		var request_data = {'page':1};
		ajax_request_server(function_name, request_data,get_flash_img_list_callback);
		
		
		
		/* 点击 加载更多 */	
	  	 	$('#emLoadnull').click(function(){
			if(next_page == -1){
				return;
			}
			data = {'page':next_page++, };
		 	get_product_list(data, product_list_callback);
		}); 
		
		/* 不去点击 加载更多，而是自动加载更多 */	
	 	var range = 50;             //距下边界长度/单位px  
		var _srollPos = 0;
		var pageNum = 2;
	    var totalheight = 0; 
	    var main = $("#list_article");
		var js = 0;
		
	    $(window).scroll(function(){
	       var srollPos = $(window).scrollTop();    //滚动条距顶部距离(页面超出窗口的高度)  
	       if(srollPos<_srollPos){
	            return;
	       }else{
	       	_srollPos = srollPos;
	       }
	       
	       if(_is_loading){
	    	   //alert('aaaaa');
	    	   return;
	       }
	       
	       totalheight = parseFloat($(window).height()) + parseFloat(srollPos);  
	       if(($(document).height()-range) <= totalheight ) {
	    	   _is_loading = true;

	       if (next_page == -1){
	          return;
	        } else{
	        	data = {'page':next_page++, };
	     	 	get_product_list(data, product_list_callback);
	        }
	      }
	    }); 
	
	});

	

	</script>
	
	
		</body>
</html>